<template>
  <div>
    <div>——————---————————</div>
    <h3>{{msgFromChild}}</h3>
    <input v-model="text" />
    <button @click="clearInput">清空</button>
    <button @click="$emit('addList',text);clearInput()">提交</button>
    <button @click="$emit('removeAll')">重置清单</button>
  </div>
</template>
<script>
  import { ref,onMounted } from "vue";
  import bus from "vue3-eventbus";
  export default {
    props: {
      title: String
    },
    setup() {
      const msgFromChild = ref("");
      const text = ref("");
      const clearInput = () => {
        text.value = "";
      };
      onMounted(() => {
        bus.on("getMsg", msg => {
          // title.value = msg;
          msgFromChild.value = msg;
        })
      })
      return {
        msgFromChild,
        // msg,
        text,
        // title,
        clearInput
      }
    }

  }
</script>